<template>
  <div class="app-container">
    <div slot="header" class="clearfix">
      <!-- <ComSelect @EventChange="ChangeFn" :options="options"></ComSelect> -->
    </div>
    <div class="laws-updata">
      <div slot="header" class="clearfix">
        <comForm
          ref="comForm"
          @EventReset="resetFn"
          @EventOnsubmit="queryFn"
          :list="formList"
        ></comForm>
      </div>
      <div>
        <ComTable
          @handleCurrentChange="CurrentPageNumChangeFn"
          @handleSizeChange="currentPageSizeChangeFn"
          :pagination="{ total: paging.total }"
          :list="tableList"
          :modes="modesList"
          :config="{ border: true, width: 200, loading }"
        >
          <el-table-column :key="romdom" width="200" align="left">
            <template #default="{ row }">
              <el-button
                plain
                size="mini"
                type="primary"
                @click="updataDetailFn(row)"
                >查看法规</el-button
              >
              <el-button
                @click="
                  $router.push({
                    path: '/contentPlatform/laws/relevantReports',
                  })
                "
                plain
                size="mini"
                type="primary"
                >相关内容</el-button
              >
            </template>
          </el-table-column>
        </ComTable>
      </div>
    </div>
  </div>
</template>

<script>
import ComTable from "../../../components/comTable.vue";
import comForm from "../../../components/comForm.vue";
import { getLawUpdateLstApi } from "@/wss/api/lawUpdate";
import { getDocGetInfoApi } from "@/wss/api/ContentSupervision";
import ComSelect from "../../../components/comSelect.vue";
export default {
  components: {
    comForm,
    ComTable,
    ComSelect,
  },
  data() {
    return {
      romdom: "",
      loading: false,
      formList: {
        modes: [
          {
            formType: "input",
            mode: "title",
            label: "法规",
            value: "",
            placeholder: "请输入法规名称",
          },

          // {
          //   formType: "select",
          //   mode: "status",
          //   label: "状态",
          //   value: "",
          //   select: [
          //     {
          //       label: "全部",
          //       value: "",
          //     },
          //     {
          //       label: "有效 ",
          //       value: "0",
          //     },
          //     {
          //       label: "部分失效",
          //       value: "1",
          //     },
          //     {
          //       label: "失效",
          //       value: "2",
          //     },
          //     {
          //       label: "尚未生效",
          //       value: "3",
          //     },
          //   ],
          // },
          {
            formType: "datePicker",
            mode: "temp",
            label: "更新日期",
            value: "",
            startPlaceholder: "开始日期",
            endPlaceholder: "结束日期",
            pickerType: "datetimerange",
          },
        ],
      },

      tableList: [],
      modesList: [
        {
          label: "法条",
          mode: "title",
        },
        {
          label: "原条款",
          mode: "beforeText",
          width: 300,
          showOverflowTooltip: true,
        },
        {
          label: "更新后的条款",
          showOverflowTooltip: true,

          mode: "afterText",
          width: 300,
        },
        {
          label: "操作人",
          mode: "createBy",
          align: "center",
        },
        {
          label: "更新日期",
          mode: "updatedTime",
        },
      ],
      paging: {
        pageNum: 1,
        pageSize: 10,
        total: 10,
        // docId: "1456211558367236096",
      },
    };
  },
  async created() {
    this.getLawUpdateLstFn();
  },
  methods: {
    // 重设函数
    resetFn() {
      this.currentSelect = "";
      this.romdom = Math.random();
      this.options.value = "";
      this.paging.status = "";
    },
    // 选择框发生改变时
    async ChangeFn(value) {
      this.$refs.comForm.resetFn();
      this.currentSelect = value;
      // 更新是状态（如代编辑）
      this.paging = {
        pageNum: 1,
        pageSize: 10,
        status: "",
        total: 10,
      };
      this.options.value = value;
      this.paging.status = value;
      this.getLawUpdateLstFn(this.paging);
    },
    async updataDetailFn(row) {
      let { data } = await getDocGetInfoApi({ id: row.docId });

      // console.log(data, "data11111111");
      // 防止data为空
      if (!data) {
        this.$message({
          type: "error",
          message: "没有对应的数据",
        });
        return;
      }

      this.$router.push({
        path: "/contentPlatform/laws/laws-details",
        query: { esId: data.esId, docId: row.docId },
      });
    },
    // 页数发生改变时候
    CurrentPageNumChangeFn(pageNum) {
      this.paging.pageNum = pageNum;
      this.getLawUpdateLstFn();
    },
    // 当前页容量发生改变时候
    currentPageSizeChangeFn(pageSize) {
      this.paging.pageSize = pageSize;
      this.getLawUpdateLstFn();
    },
    queryFn(arr) {
      arr.forEach((item) => {
        for (const key in item) {
          this.paging[key] = item[key];
        }
      });
      if (this.paging["temp"] instanceof Array) {
        this.paging["beginTime"] = this.paging["temp"][0];
        this.paging["endTime"] = this.paging["temp"][1];
        this.paging["temp"] = "";
      }
      this.paging.pageNum = 1;
      this.getLawUpdateLstFn();
    },
    async getLawUpdateLstFn() {
      this.loading = true;
      let result = await getLawUpdateLstApi(this.paging);
      console.log(result, "result");
      this.tableList = result.rows;
      this.paging.total = result.total;
      this.loading = false;
    },
  },
};
</script>

<style lang="scss" scoped>
.clearfix {
  margin-top: 20px;
}
</style>